<template>
  <div class="contain">
    <el-card class="login-box">
      <span>账号:</span>
      <el-input
        id="username"
        v-model="login.username"
        placeholder="请输入账号"
      ></el-input>
      <span>密码:</span>
      <el-input
        id="password"
        v-model="login.password"
        placeholder="请输入密码"
      ></el-input>
      <el-button type="primary" @click="loginClk()">登陆</el-button>
      <el-button type="primary" @click="direct()">直接进入</el-button>
    </el-card>
  </div>
</template>

<script>
// import CryptoJS from "crypto-js";


export default {
  data() {
    return {
      login: {
        username: "admin",
        password: "admin",
        rememberme: false,
      },
    };
  },
  methods: {
    // 登陆示例
    loginClk() {
      console.log(this.login);
			this
        .$post("/yz_manager/sys/login", {
          username: this.login.username,
          // 密码最好加密
          password: this.encrypt(this.login.password)
        })
        .then(res => {
          if (res.code == 200) {
            sessionStorage.setItem("sessionId", res.sessionId);
            sessionStorage.setItem("systemName", res.realName);
            localStorage.setItem("loginStateId", res.loginStateId);
            this.$router.push({
                    path: "/"
                  });
          } else {
            this.$message.error(res.msg);
          }
        });
    },
    encrypt(password) {
      //加密
      return password
    },
    direct() {
      this.$router.push({
        path: "/"
      });
    }
  },
};
</script>

<style>
#username {
  margin-bottom: 20px;
}
#password {
  margin-bottom: 20px;
}
.contain {
  justify-items: center;
}
.login-box {
  position: absolute; /*绝对定位*/
  left: 50%;
  top: 50%;

  transform: translate(-50%, -50%); /*(横轴偏移，纵轴偏移)*/
  width: 400px;
}
</style>